﻿@model PagedList.IPagedList<MvcMedicalProvider.Models.UiDoctor>
@using PagedList.Mvc;

<link href="~/Content/PagedList.css" rel="stylesheet" type="text/css" />
@{
    ViewBag.Title = "Preview - Provider Cost Comparison";
    Layout = "~/Views/Shared/_Layout.cshtml";
}

@using (Html.BeginForm("PreviewResults", "SearchProvider"))
{
    <div class="title" align="center"><div style="height: 10px"></div>Provider Cost Comparison</div>
    <center>
        <div style="padding: 20px 0 0 0; width: 1000px" align="center">
            <table border="0" cellpadding="0" cellspacing="0" style="font-size: 15px">
                <tbody>
                    <tr>
                        <td valign="top" align="left">

                            <table border="0" cellpadding="0" cellspacing="0" style="line-height: 20px">
                                <tbody>
                                    <tr>
                                        <th colspan="2">&nbsp; Provider Specialty</th>
                                    </tr>
                                    <tr>
                                        <td style="padding: 5px" colspan="2">
                                            <select name="speci" id="speci" style="border: 1px solid #D0D0D0">
                                                <option value="">– ANY SPECIALTY –</option>
                                                @foreach (MvcMedicalProvider.Models.ProviderType item in ViewBag.ProviderTypes)
                                                {
                                                    <option value="@item.provider_type">@item.provider_type</option>
                                                }
                                            </select>
                                        </td>
                                    </tr>
                                    <tr>
                                        <th>&nbsp; Provider ZIP Code</th>
                                        <th>&nbsp; Radius</th>
                                    </tr>
                                    <tr>
                                        <td style="padding: 5px">
                                            <input type="text" name="zipCode" id="zipCode" maxlength="10" class="ctinput"
                                                   style="width: 130px; text-align: center; padding-left: 3px"
                                                   onkeypress="return numbersOnly(event)">
                                        </td>
                                        <td>
                                            <select name="range" id="range">
                                                <option value="10"> 10 Miles Radius</option>
                                                <option value="25"> 25 Miles Radius</option>
                                                <option value="50"> 50 Miles Radius</option>
                                                <option value="100"> 100 Miles Radius</option>
                                            </select>
                                        </td>
                                    </tr>
                                    <tr>
                                        <th colspan="2" align="center" style="line-height: 12px; padding-top: 6px;">
                                            <span>Doctor</span><br />
                                            <span>Last Name</span>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span>First Name</span>
                                        </th>
                                    </tr>
                                    <tr>
                                        <td style="padding: 5px">
                                            <input type="text" name="dlname" id="dlname" maxlength="20" class="ctinput"
                                                   style="width: 130px; text-align: center; padding-left: 3px; color: GrayText;">

                                        </td>
                                        <td>
                                            <input type="text" name="dfname" id="dfname" maxlength="20" class="ctinput"
                                                   style="width: 130px; text-align: center; padding-left: 3px; color: GrayText;">
                                        </td>
                                    </tr>
                                </tbody>
                            </table>
                            <br>
                            <table border="0" cellpadding="0" cellspacing="0" style="line-height: 20px">
                                <tbody>
                                    <tr>
                                        <td valign="middle">
                                            &nbsp;<input type="submit"
                                                         onclick="submitSearchProviderForm(); return false;" value="Refine">&nbsp;
                                        </td>
                                        <td valign="middle" id="ldimg" style="display: none">
                                            <table border="0">
                                                <tbody>
                                                    <tr>
                                                        <td valign="middle">
                                                            &nbsp;
                                                            <img src="@Url.Content("~/images/loading_32x32.gif")" border="0">
                                                        </td>
                                                        <td valign="middle"> &nbsp; Searching ...</td>
                                                    </tr>
                                                </tbody>
                                            </table>
                                        </td>
                                    </tr>
                                </tbody>
                            </table>


                            <div align="left" style="padding-top: 5px">
                                &nbsp;<a href="/SearchProvider/PreviewIndex">Back</a>
                            </div><br>
                        </td>
                        <td style="padding: 0 0 0 20px" align="left" valign="top">
                            <div style="width: 500px" align="left" id="divContentForHasResult" class="dn">
                                &nbsp; Providers charge all payers the same amount for each type of service. Payers (insurers and the government) pay each provider a
                                different negotiated amounts for the same service. The payments made to providers are typically less than what is charged.
                                <div class="cb"></div>
                                &nbsp; Uninsured persons may be asked to pay the full charge amount. Your actual cost will depend on your insurance coverage and/or
                                individual practice rules. The amounts represented here are Medicare payments. Commercial and other payers generally follow Medicare payment trends.
                                <div class="cb"></div>
                                &nbsp; The search tables will display both the charges submitted by the provider and the payments made by Medicare.
                            </div>
                        </td>
                    </tr>
                    <tr>
                        <td colspan="2">
                            <div class="dn" id="divNoresultsAvail" style="float: left;">* No results are available in Federal Database</div>
                            <div class="dn" id="divDisplayingXResults" style="float: right;"></div>
                        </td>
                    </tr>
                    <tr>
                        <td colspan="2">
                            <table border="0" cellpadding="5" cellspacing="2" id="ltblResult" class="dn" style="font-size: 12px;">
                                <tbody>
                                    <tr style="background-color: #4f81bd">
                                        <th align="left" style="min-width: 250px; color: white;"><a href="javascript:void(0);" style="color: white;" onclick="submitFormWithSorting(1)">Provider Name</a></th>
                                        <th align="center" style="color: white;"><a href="javascript:void(0);" style="color: white;" onclick="submitFormWithSorting(2)">Amount Charged by<br>provider for a typical<br>visit for a new patient</a></th>
                                        <th align="center" style="color: white;"><a href="javascript:void(0);" style="color: white;" onclick="submitFormWithSorting(3)">Amount paid by<br>Medicare for typical<br>new patient visit</a></th>
                                        <th align="center" style="color: white;"><a href="javascript:void(0);" style="color: white;" onclick="submitFormWithSorting(4)">Amount Charged by<br>provider for typical<br>visit for an established patient</a></th>
                                        <th align="center" style="color: white;"><a href="javascript:void(0);" style="color: white;" onclick="submitFormWithSorting(5)">Amount paid by<br>Medicare typical visit for<br>an established patient</a></th>
                                    </tr>
                                    @{
    var classTr = "tro";
                                    }
                                    @for (int i = 0; i < Model.Count(); i++)
                                    {
                                        var doctor = Model[i];

                                        var providerGender = doctor.Gender;
                                        var providerZip = doctor.ZipCode;
                                        var providerState = doctor.State;
                                        var providerAddress = doctor.Address;
                                        var providerAddressForGM = doctor.Address + ", " + doctor.State + " " + doctor.ZipCode;
                                        var providerName = doctor.DoctorName;
                                        var providerCity = doctor.City;


                                        var average_submitted_chrg_amt = MvcMedicalProvider.Helpers.UIHelper.GetProviderMoney(doctor.average_submitted_chrg_amt);
                                        var average_Medicare_payment_amt = MvcMedicalProvider.Helpers.UIHelper.GetProviderMoney(doctor.average_Medicare_payment_amt);
                                        var average_submitted_chrg_amt1 = MvcMedicalProvider.Helpers.UIHelper.GetProviderMoney(doctor.average_submitted_chrg_amt1);
                                        var average_Medicare_payment_amt1 = MvcMedicalProvider.Helpers.UIHelper.GetProviderMoney(doctor.average_Medicare_payment_amt1);

                                        if (classTr == "tre")
                                        {
                                            classTr = "tro";
                                        }
                                        else
                                        {
                                            classTr = "tre";
                                        }
                                        <tr class="@classTr">
                                            <td>
                                                <span class="ProviderName" style="cursor: pointer;"
                                                      onclick="showDoctorDetails('@providerName', '@providerAddress', '@providerCity', '@providerState', '@providerAddressForGM')">@providerName</span>
                                                    <div class="tooltiptext">
                                                        <b>Gender: </b>@providerGender
                                                        <br /><b>Address: </b>@providerAddress
                                                        <br /><b>City: </b>@providerCity
                                                        <br /><b>State: </b>@providerState
                                                        <br /><b>ZipCode: </b>@providerZip
                                                    </div>
                                                </td>
                                                <td align="right">@average_submitted_chrg_amt</td>
                                                <td align="right">@average_Medicare_payment_amt</td>
                                                <td align="right">@average_submitted_chrg_amt1</td>
                                                <td align="right">@average_Medicare_payment_amt1</td>
                                            </tr>
                                    }
                                </tbody>
                            </table>
                        </td>
                    </tr>
                    <tr>
                        <td colspan="2">
                            @using (Html.BeginForm("ShowResults", "SearchProvider"))
                            {
                                <div id="divPaging">
                                    @Html.PagedListPager(Model, page => Url.Action("ShowResults", new { page, sortOrder = ViewBag.CurrentSort, currentFilter = ViewBag.CurrentFilter }))
                                </div>
                            }

                        </td>
                    </tr>
                </tbody>
            </table>
            <br>
            <br>
        </div>
    </center>
    <div style="display: none">
        <img src="@Url.Content("~/images/loading_32x32.gif")" />
    </div>
    <div id="dlgProviderMap" title="Doctor information">
        <table width="100%">
            <tr>
                <td>Name:</td>
                <td style="padding-left: 5px;"><span id="spanDoctorName" /></td>
            </tr>
            <tr>
                <td>Address:</td>
                <td style="padding-left: 5px;"><span id="spanAddress" /></td>
            </tr>
            <tr>
                <td>City:</td>
                <td style="padding-left: 5px;"><span id="spanCity" /></td>
            </tr>
            <tr>
                <td>State:</td>
                <td style="padding-left: 5px;"><span id="spanState" /></td>
            </tr>
            <tr>
                <td colspan="2">
                    <div id="map_canvas" style="height: 350px; border: 1px solid #2F4F2F;"></div>
                </td>
            </tr>
        </table>
        <div class="cb"></div>
    </div>

}

<script type="text/javascript">
    $(document).ready(function () {
        $("#speci").val("@ViewBag.speci");
        $("#zipCode").val("@ViewBag.zipCode");
        $("#range").val("@ViewBag.range");
        $("#dfname").val("@ViewBag.dfname");
        $("#dlname").val("@ViewBag.dlname");

        $("#dlgProviderMap").dialog({
            modal: true,
            width: 550,
            height: 560,
            autoOpen: false,
            resizeStop: function(event, ui) {google.maps.event.trigger(map, 'resize')  },
            open: function(event, ui) {google.maps.event.trigger(map, 'resize'); },
            buttons: {
                Ok: function () {
                    $(this).dialog("close");
                }
            }
        });

        $("#divContentForHasResult").show();
        var hasResult = '@ViewBag.HasResult' == 'True';
        var overLimit = '@ViewBag.OverLimit' == 'True';
        if (!hasResult) {
            var noResutlsString = "No results returned from your query. Please check the Doctor’s name or expand your search criteria.";
            @*if ('@ViewBag.dfname' != 'Optional' || '@ViewBag.dlname' != 'Optional') {
                noResutlsString += " Please check the Doctor’s name or expand your search criteria.";
            }*@
            $("#divContentForHasResult").html(noResutlsString);
            $("#divNoresultsAvail").hide();
            $("#divDisplayingXResults").hide();
        } else {
            if (!overLimit) {
                $("#divNoresultsAvail").show();
                $("#divDisplayingXResults").html("Now Displaying @ViewBag.TotalItemCount Results").show();
                $("#ltblResult").show();

                InitPagingData();

            } else {
                $("#divContentForHasResult").html("Results exceeded the maximum limit, please narrow your search criteria.");
                $("#divNoresultsAvail").hide();
                $("#divDisplayingXResults").hide();
                $("#divPaging").hide();
            }
        }
    });

    InitPagingData = function () {
        var divContainer = $("#divPaging");

        var hrefArr = divContainer.find("a");

        for (var i = 0; i < hrefArr.length; i++) {
            var orgHref = $(hrefArr[i]).attr("href");
            if (typeof (orgHref) != "undefined") {
                var queryString = orgHref.split('?')[1];
                $(hrefArr[i]).attr("href", "javascript:void(0);");
                $(hrefArr[i]).attr("orgQS", queryString);

                $(hrefArr[i]).click(function () {
                    var sortBy = getParameterByName("sortBy");
                    if (typeof (sortBy) == "undefined") {
                        sortBy = "1";
                    }

                    var sortDirection = getParameterByName("direction");
                    if (typeof (sortDirection) == "undefined") {
                        sortDirection = "asc";
                    }

                    var orgQS = $(this).attr("orgQS");
                    var currentAction = $("form").attr("action");
                    $("form").attr("action", currentAction + "?" + orgQS + "&sortBy=" + sortBy + "&direction=" + sortDirection);
                    $("form").submit();
                });
            }
        }
    };

    var geocoder;
    var map;
    function initialize() {
        geocoder = new google.maps.Geocoder();
        var latlng = new google.maps.LatLng('44.339565', '-114.960937');
        var styleArray = [
            { featureType: "all", stylers: [{ visibility: "off" }] },
            { featureType: "road", stylers: [{ visibility: "on" }] },
            { featureType: "administrative", stylers: [{ visibility: "on" }] }
            ];
        var myOptions = {
            styles: styleArray,
            zoom: 8,
            mapTypeId: google.maps.MapTypeId.ROADMAP,
            marker: true
        }
        map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);
    }

    function codeAddress(address) {
        geocoder.geocode({ 'address': address }, function (results, status) {
            if (status == google.maps.GeocoderStatus.OK && results.length) {
                map.setCenter(results[0].geometry.location);
                var marker = new google.maps.Marker({
                    map: map,
                    position: results[0].geometry.location,
                    title: address
                });

            } else {
                alert("Geocode was not successful for the following reason: " + status);
            }
        });
    }

    google.maps.event.addDomListener(window, 'load', initialize);
</script>